<style type="text/css" media="screen">
	#divWizardList {float:left; width:100%;}
	#divCart {float:right;}
	.step {float:left; border:1px solid #000; padding:10px; width: 100%; margin-bottom: 10px; }
	.step_title {float:left; width:100%;}
	.category { float:left; border:1px solid #000; padding:10px; cursor: pointer; margin-right: 10px; }
	.restaurant  { float:left; border:1px solid #000; cursor: pointer; margin-right: 10px; margin-bottom: 10px; }
	.cell  { border: 2px white solid; float:left; cursor: pointer; margin-right: 10px; margin-bottom: 10px; z-index:200; background: #ffffff;}
	.backstep_button { cursor: pointer; float: right;}
	.step_option { float:left; border:1px solid #000; padding:10px; width:100%; margin:10px 0;}
	#step2_option_payment_card { cursor:pointer; float:right; margin:0 10px;}
	#step2_option_payment_cash { cursor:pointer; float:right; margin:0 10px;}
	#step2_option_order { float:right; margin: 0 10px;}
	#step3_option_order { float:right; margin: 0 10px;}
	.step3_page_button { cursor: pointer; width:50px; height:550px; }
	#prev_button { float: left; border:1px solid #000;}
	#next_button { float: right; border:1px solid #000;}
	#step3_content { margin-left: 20px; float:left; width:100%;}
		
	.address_button { float:left; cursor: pointer; margin: 0 10px; }
	#address_value { float: left; }
	
	#step5_confirm { float:left; width:200px;}
	
	.payment_button { float:right; margin-left:10px;}
</style>

<script type="text/javascript" charset="utf-8">
	var minimumPrice = new Object();
	var payment = new Object();

	var staticArgs=0;
	var staticPayment=0;
	var staticOrder=0;
	var present_step=1;
	
	var staticPage=0;
	var totalPage=0;

	function forCart() {
		$(".cell").mouseover(function() {
			$(this).css("border","2px #ccc solid");
		});
		$(".cell").mouseout(function() {
			$(this).css("border","2px white solid");
		});
			//주문을 위한 함수들
		$(".cell").dblclick(function() {
			var id = $(this).children('#id').val();
			var price = $(this).children('#price').val();
			var calorie = $(this).children('#calorie').val();
			var name = $(this).children('#name').val();
			var phone= $(this).children('#phone').val();
			var nickname= $(this).children('#nickname').val();
			
			toCart(id, price,calorie,name,phone,nickname);
		});
		$( ".cell" ).draggable({
			start: function() {
				var id = $(this).children('#id').val();
				var price = $(this).children('#price').val();
				var calorie = $(this).children('#calorie').val();
				var name = $(this).children('#name').val();
				var phone= $(this).children('#phone').val();
				var nickname= $(this).children('#nickname').val();
				
				copyVar(id, price, calorie, name, phone, nickname);

				var temp_top = $('#divCart').css("margin-top");
				temp_top = parseInt(temp_top.substring(0, temp_top.length-2));
				$('#divCart').css("margin-top",temp_top-1);
				$('#divCart').css("margin-right","7px");
				$('#divCart').css("border","2px #cc5555 solid");
				
				$('#droptheitem').css("visibility","visible");
			},
			helper: function() {
				return $(this).clone();	
			},
			stop: function() {
				$('#divCart').css("border","1px solid #b8b8b8");
				$('#divCart').css("margin-right","8px");

				var temp_top = $('#divCart').css("margin-top");
				temp_top = parseInt(temp_top.substring(0, temp_top.length-2));
				$('#divCart').css("margin-top",temp_top+1);
				
				$('#droptheitem').css("visibility","hidden");
			}
		});
	}

	$(document).ready(function() {

		// 초기화
		$('#step2').animate({
		    opacity: 0.4}, 0
		);
		$('#step3').animate({
		    opacity: 0.4}, 0
		);
		$('#step4').animate({
		    opacity: 0.4}, 0
		);
		$('#step5').animate({
		    opacity: 0.4}, 0
		);

		// 주문하기 버튼
		$('#step5_confirm').click(
			function() {
				document.divCartForm.submit();
			}
		);

		// prev_button
		$('#prev_button').click(
			function() {
				if(staticPage>0)
					staticPage--;
				//alert(staticPage);
				getContents(3, staticArgs, staticPayment, staticOrder, 0);
			}
		);
		
		// next_button
		$('#next_button').click(
			function() {
				if(staticPage<totalPage)
					staticPage++;
				//alert(totalPage+" "+staticPage);
				getContents(3, staticArgs, staticPayment, staticOrder, 0);
			}
		);

		// 2단계에서 1단계로 뒤로가기 버튼
		$('#backstep_button_2').click(
			function() {
				moveToPreStep(2);
				$('#step2'+'_content').empty();
				$('#step2').animate({
				    opacity: 0.4}, 0
				);
			}
		);

		// 3단계에서 2단계로 뒤로가기 버튼		
		$('#backstep_button_3').click(
			function() {
				moveToPreStep(3);
				$('#step3'+'_content').empty();
				$('#step3').animate({
				    opacity: 0.4}, 0
				);
			}
		);
		
		// 4단계에서 3단계로 뒤로가기 버튼		
		$('#backstep_button_4').click(
			function() {
				moveToPreStep(4);
    		    $('#address_value').attr('value', '');
    		    $('#address_value').attr('readonly', 'readonly');
				$('#step4').animate({
				    opacity: 0.4}, 0
				);
			}
		);
		
		// 5단계에서 4단계로 뒤로가기 버튼		
		$('#backstep_button_5').click(
			function() {
				moveToPreStep(5);
				$('#step5').animate({
				    opacity: 0.4}, 0
				);
			}
		);
		
		// 3단계에서 4단계로 넘어가기 버튼
		$('#nextstep_button_3').click(
			function() {
				moveToNextStep(3);
				$('#step4').animate({
				    opacity: 1.0}, 1000
				);
    		    $('#address_value').attr('value', '');
    		    $('#address_value').attr('readonly', 'readonly');
			}
		);
		
		// 4단계에서 5단계로 넘어가기 버튼
		$('#nextstep_button_4').click(
			function() {
				moveToNextStep(4);
				$('#step5').animate({
				    opacity: 1.0}, 1000
				);
			}
		);


		//현금 카드에 따른 xml 요청
		$('#step2_option_payment_card').click(
			function() {
				staticPayment = 2;
    		    getContents(2, staticArgs, staticPayment, staticOrder, 0);
			}
		);
		
		$('#step2_option_payment_cash').click(
			function() {
				staticPayment = 1;
    		    getContents(2, staticArgs, staticPayment, staticOrder, 0);
			}
		);
		
		//기본주소입력
		$('#address_button_1').click(
			function() {
    		    $('#address_value').attr('value','{$logged_info->address[0]} {$logged_info->address[1]}');
    		    $('#address_value').attr('readonly', 'readonly');
			}
		);
		//마지막배송지주소입력
		$('#address_button_2').click(
			function() {
				var ordered_address = '{$logged_info->recentaddress}';
				var recent_address = ordered_address.split('|');
				
    		    $('#address_value').attr('value',recent_address[0]);
    		    $('#address_value').attr('readonly', 'readonly');
			}
		);
		//새주소입력
		$('#address_button_3').click(
			function() {
    		    $('#address_value').attr('value', '');
    		    $('#address_value').attr('readonly', '');
			}
		);
	});
	
	function moveToNextStep(present_step) {
		window.scrollTo(0,$('#step'+(present_step+1)).position().top-5);
	}
	
	function moveToPreStep(present_step) {
		window.scrollTo(0,$('#step'+(present_step-1)).position().top-5);
	}

	//전송받은 xml을 알맞게 출력
    function addmsg(type, step, msg){
    	
		$('#step3_content').empty();
		
		totalPage = $(msg).find("totalPage").text();
		
    	if(type=='new') {
	    	if(step==1) {
	    		var msgStr = "";

				$(msg).find("item").each(function () {
	    			msgStr += "<div class='category' onClick='getContents(2, "+$(this).find("category_srl").text()+", 0, 0, 1); moveToNextStep(1); return false;'>"+$(this).find("title").text()+"</div>";
				});

				$('#step'+step+'_content').empty();
				$('#step'+step+'_content').append(msgStr);
				$('#step'+step).show();
			}
	    	else if(step==2) {
	    			
		    	present_step = 2;
		    	
	    		var msgStr = "";
	    		
				$(msg).find("item").each(function () {
					msgStr += "<div class='restaurant' onClick='getContents(3, "+$(this).find("member_srl").text()+", 0, 0, 1); moveToNextStep(2); return false;'>"+$(this).find("title").text()+"<br/>"+$(this).find("minimumPriceStr").text()+"원<br/>"+$(this).find("paymentMethod").text()+"<br/>"+$(this).find("opentime").text()+"~"+$(this).find("closetime").text()+"<br/> <img src='"+$(this).find("uploaded_filename").text()+"' width=160 height=130/></div>";
				});

				$('#step'+step+'_content').empty();
				$('#step'+step+'_content').append(msgStr);
				$('#step'+step).animate({
				    opacity: 1.0}, 1000
				);
			}
	    	else if(step==3) {
	    		present_step = 3;
	    		
	    		var msgStr = "";

				$(msg).find("item").each(function () {
	    			msgStr += "<div class='cell'>"
	    				+$(this).find("title").text()
	    				+"<br/>"+$(this).find("nick_name").text()
	    				+"<br/>"+$(this).find("priceStr").text()+"원"
	    				+"<br/><img src='"+$(this).find("uploaded_filename").text()+"' width=160 height=130/>"
	    				+"<div>담기</div>"
						+"<input type='hidden' id='id' value='"+$(this).find("document_srl").text()+"'>"
						+"<input type='hidden' id='price' value='"+$(this).find("price").text()+"'>"
						+"<input type='hidden' id='calorie' value='"+$(this).find("calorie").text()+"'>"
						+"<input type='hidden' id='name' value='"+$(this).find("title").text()+"'>"
						+"<input type='hidden' id='phone' value='"+$(this).find("cellphone").text()+"'>"
						+"<input type='hidden' id='nickname' value='"+$(this).find("nick_name").text()+"'>"
	    			+"</div>";
				});

				$('#step'+step+'_content').empty();
				$('#step'+step+'_content').append(msgStr);
				forCart();
				$('#step'+step).animate({
				    opacity: 1.0}, 1000
				);
			}
	    	else {
				$('#step'+step+'_content').empty();
				$('#step'+step+'_content').append('다시 시도하시기 바랍니다.');
	    	}
	    }
	}

	// xml을 요청
    function getContents(step, args, payment, order, page){
    	if(args==0) {
    		var urlStr = "/~yamnyam/wizard/wizard_process.php?step="+step;
    	}
    	else {
	    	staticArgs=args;
    		var urlStr = "/~yamnyam/wizard/wizard_process.php?step="+step+"&args="+args;    	
    	}
    	
    	if(page==1) {
    		staticPage = 0;
    		urlStr += ("&page="+staticPage);
    	} else {
    		urlStr += ("&page="+staticPage);
    	}
    	
    	if(payment!=0) {
    		urlStr += ("&payment="+payment);
    	}
    	
    	urlStr += ("&order="+order);
    	
        $.ajax({
            type: "GET",
            url: urlStr, 

            async: true,
            cache: false,
            timeout:50000,

            success: function(data) {
            	//test(data);
            	//alert(data);
                addmsg("new", step, data);
            },
            error: function(XMLHttpRequest, textStatus, errorThrown){
                addmsg("error", step, textStatus + " (" + errorThrown + ")");
            }
        });
    };
    
    $(document).ready(function(){
        getContents(1, 0, 0, 0, 0);
    });
</script>


{@ // 상점의 이름으로부터 상점이 설정한 최소값을 구한다.
	$oDB = &DB::getInstance();
	$result = $oDB->_query("SELECT nick_name FROM yman_documents where module_srl = 141;");
	$output = $oDB->_fetch($result);
	$nickname = (array)$output;
}
<!--@for($i=0;$i<count($nickname);$i++)-->
	{@
	$result = $oDB->_query("SELECT value from yman_document_extra_vars where document_srl = (SELECT document_srl FROM yman_documents where nick_name = '".$nickname[$i]->nick_name."' and module_srl = 141 limit 1) and var_idx=1 limit 1;");
	
	$output = $oDB->_fetch($result);
	
	$temp = (array)$output;
	
	// 상점의 이름으로부터 상점 결제방법을 구한다.
	$result = $oDB->_query("SELECT value from yman_document_extra_vars where document_srl = (SELECT document_srl FROM yman_documents where nick_name = '".$nickname[$i]->nick_name."' and module_srl = 141 limit 1) and var_idx=3 limit 1;");
	
	$output = $oDB->_fetch($result);
	
	$payment = (array)$output;
	}
	<script type="text/javascript">
		// <![CDATA[
		minimumPrice['{$nickname[$i]->nick_name}']={$temp[value]};
		payment['{$nickname[$i]->nick_name}']="{$payment[value]}";
		// ]]>
	</script>
<!--@end-->

<div id="divWizardList">
	<div id="step1" class="step">
		<div id="step1_title" class="step_title">STEP 1.음식 종류 선택</div>
		<div id="step1_content" class="step_content"></div>
	</div>
	<div id="step2" class="step">
		<div id="step2_title" class="step_title">
			STEP 2.음식점 선택
			<div id='backstep_button_2' class='backstep_button'>이전단계로</div>
		</div>
		<div id="step2_option" class="step_option">
			결제방식을 선택해 주세요
			<select id="step2_option_order" onchange="getContents(2, staticArgs, staticPayment, this.value, 0)">
				<option value="0">랜덤순</option>
				<option value="1">이름순</option>
				<option value="2">최소가격순</option>
			</select>		
			<div id="step2_option_payment_card">카드</div>
			<div id="step2_option_payment_cash">현금</div>
		</div>
		<div id="step2_content" class="step_content"></div>
	</div>
	<div id="step3" class="step">	
		<div id="step3_title" class="step_title">
			STEP 3.음식 선택
			<div id='nextstep_button_3' class='backstep_button'>다음단계로</div>
			<div id='backstep_button_3' class='backstep_button'>이전단계로&nbsp;</div>
		</div>
		<div id="step3_option" class="step_option">
			주문하실 수량만큼 음식 이름을 클릭해주세요
			<select id="step3_option_order" onchange="getContents(3, staticArgs, staticPayment, this.value, 0)">
				<option value="0">랜덤순</option>
				<option value="1">이름순</option>
				<option value="2">가격순</option>
			</select>
		</div>
		<div id="prev_button" class='step3_page_button'>이전</div>
		<div id="next_button" class='step3_page_button'>다음</div>	
		<div id="step3_content" class="step_content"></div>
	</div>
	<div id="step4" class="step">	
		<div id="step4_title" class="step_title">
			STEP 4.배송지 확인
			<div id='nextstep_button_4' class='backstep_button'>다음단계로</div>
			<div id='backstep_button_4' class='backstep_button'>이전단계로&nbsp;</div>
		</div>
		<div id="step4_option" class="step_option">
			<div id="address_button_1" class="address_button">기본주소</div>
			<div id="address_button_2" class="address_button">마지막 배송지</div>
			<div id="address_button_3" class="address_button">새주소</div>
		</div>
		<div id="step4_content" class="step_content">
			<input type="text" name="address_value" id="address_value" size="100" readonly="readonly"/>
			<input type="button" value="확인" onclick="moveToNextStep(4); return false;"/>
		</div>
	</div>
	<div id="step5" class="step">	
		<div id="step5_title" class="step_title">
			STEP 5.주문 내용
			<div id='backstep_button_5' class='backstep_button'>이전단계로</div>
		</div>
		<div id="step5_option" class="step_option"></div>
		<div id="step5_confirm">
			<!--@if(!$is_logged)-->
				<a class="buttonLogin2" href="./" onclick="return alerting()"><img src="../layouts/yamnyam_layout/images/button_bill.png"/></a>
			<!--@else-->
				<input type="image" src="../layouts/yamnyam_layout/images/button_bill.png">
			<!--@endif-->
		</div>
	</div>
</div>